<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Registrar nuevo usuario</title>
        <link href="style.css" rel="stylesheet" type="text/css" />
        <script type="text/javascript">
            var ck_name = /^[A-Za-z0-9 ]{3,20}$/;
            var ck_name_long = /^[A-Za-z0-9 ]{3,50}$/;
            var ck_name_vlong = /^[A-Za-z0-9 ]{3,100}$/;
            var ck_email = /^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/i
            var ck_username = /^[A-Za-z0-9_]{1,20}$/;
            var ck_password =  /^[A-Za-z0-9!@#$%^&*()_]{6,20}$/;

            function validate(form){
                var username = form.username.value;
                var pass1 = form.pass1.value;
                var pass2 = form.pass2.value;
                var nombre = form.nombre.value;
                var apellido1 = form.apellido1.value;
                var apellido2 = form.apellido2.value;
                var email = form.email.value;
                var tel = form.tel.value;
                var Direccion = form.Direccion.value;
                var tipoU = form.tipoUsuario.options[form.tipoUsuario.options.selectedIndex].value;
                var opcional = form.opcional.value;
                //var errlist = document.getElementById("errlist");
                var errors = [];

                if (!ck_username.test(username)){
                    //errlist.firstChild.nodeValue += "Nombre de usuario invalido.&#13;&#10;";
                    errors[errors.length] = "Nombre de usuario invalido.";
                }
                if (!ck_password.test(pass1) && (pass1 != pass2)) {
                    //errlist.firstChild.nodeValue += "Formato de contraseña invalido.&#13;&#10;";
                    errors[errors.length] = "Formato de contraseña invalido.";
                }
                else{
                    if(pass1 != pass2){
                        //errlist.firstChild.nodeValue += "Las contraseñas no coinciden.";
                        errors[errors.length] = "Las contraseñas no coinciden.";
                    }
                }
                if (!ck_name.test(nombre)) {
                    //errlist.firstChild.nodeValue += "Nombre invalido.";
                    errors[errors.length] = "Nombre invalido.";
                }
                if (!ck_name.test(apellido1)) {
                    //errlist.firstChild.nodeValue += "Primer apellido invalido.";
                    errors[errors.length] = "Primer apellido invalido.";
                }
                if(apellido2.length > 0){
                    if (!ck_name.test(apellido2)) {
                        //errlist.firstChild.nodeValue +=  "Segundo apellido invalido.";
                        errors[errors.length] = "Segundo apellido invalido.";
                    }
                }
                if (!ck_email.test(email)) {
                    //errlist.firstChild.nodeValue += "Tiene que ingresar E-mail valido.";
                    errors[errors.length] = "Tiene que ingresar E-mail valido.";
                }
                if (tipoU != 1 && !ck_name_long.test(opcional)){
                    errors[errors.length] = "Formato invalido.";
                }
                if (errors.length > 0) {

                    reportErrors(errors);
                    return false;
                }
                return true;
            }
            function reportErrors(errors){
                var msg = "Atención...\n";
                for (var i = 0; i<errors.length; i++) {
                    var numError = i + 1;
                    msg += "\n" + numError + ". " + errors[i];
                }
                alert(msg);
            }
            function changeOpt(){
                var value = frmRegistrar.tipoUsuario.options[frmRegistrar.tipoUsuario.options.selectedIndex].value;
                if(value == 1){
                    document.getElementById("optNombre").firstChild.nodeValue = ":";
                    document.frmRegistrar.opcional.disabled = true;
                    document.frmRegistrar.opcional.value = "";
                }
                else{
                    if(value == 2){
                        document.getElementById("optNombre").firstChild.nodeValue = "Nivel de profesor:";
                        document.frmRegistrar.opcional.disabled = false;
                        document.frmRegistrar.opcional.value = "";
                    }else{
                        document.getElementById("optNombre").firstChild.nodeValue = "Ente verificador:";
                        document.frmRegistrar.opcional.disabled = false;
                        document.frmRegistrar.opcional.value = "";
                    }
                }
                return true;
            }
        </script>
    </head>
    <body>
        <div id="topMenu">
            <?php include 'mods/topmenu.php'; ?>
        </div>
        <div align="center">
            <br>
            <H2>Registrar usuario nuevo.</H2>
            <br>
            <h1>Por favor llene los campos:</h1>
            <br>
            <?php
            if(isset ($_GET['s']) && $_GET['s'] == 1) {
                echo("<H4>Ya existe este nombre de usuario.</H4>");
            }
            ?>
            <br>
            <form name="frmRegistrar" enctype="multipart/form-data" action="doreg.php" method="POST" onsubmit="return validate(this);">
                <table cellspacing=5 cellpadding=5 width=500 align="center">
                    <tr>
                        <td>*Nombre de Usuario:</td>
                        <td><input name="username" type="text" size=26 maxlength="20" ></td>
                    </tr>
                    <tr>
                        <td>*Contraseña:</td>
                        <td><input name="pass1" type="password" size=26 maxlength="16"></td>
                    </tr>
                    <tr>
                        <td>*Contraseña otra vez:</td>
                        <td><input name="pass2" type="password" size=26 maxlength="16"></td>
                    </tr>
                    <tr>
                        <td>*Su Nombre:</td>
                        <td><input name="nombre" type="text" size=26 maxlength="20"></td>
                    </tr>
                    <tr>
                        <td>*Primer Apellido:</td>
                        <td><input name="apellido1" type="text" size=26 maxlength="20"></td>
                    </tr>
                    <tr>
                        <td>Segundo Apellido:</td>
                        <td><input name="apellido2" type="text" size=26 maxlength="20"></td>
                    </tr>
                    <tr>
                        <td>*Tipo de Usuario:</td>
                        <td><select name="tipoUsuario" id="tipoUsuario"  onchange="return changeOpt();" >
                                <option value=1>Administrador</option>
                                <option value=2>Profesor</option>
                                <option value=3>Evaluador</option>
                            </select></td>
                    </tr>
                    <tr>
                        <td id="optNombre">  :</td>
                        <td><input name="opcional" type="text" size=26 maxlength="50" id="opcional" disabled></td>
                    </tr>
                    <tr>
                        <td>*Unidad Académica:</td>
                        <td><select name="UA">
                                <option value=1>Unidad1</option>
                                <option value=2>Unidad2</option>
                                <option value=3>Unidad3</option>
                            </select></td>
                    </tr>
                    <tr>
                        <td>E-mail:</td>
                        <td><input name="email" type="text" size=26 maxlength="50"></td>
                    </tr>
                    <tr>
                        <td>Teléfono:</td>
                        <td><input name="tel" type="text" size=26 maxlength="10"></td>
                    </tr>
                    <tr>
                        <td>Dirección:</td>
                        <td><textarea name="Direccion" rows="4" cols="20">
                            </textarea></td>
                    </tr>
                    <tr>
                        <td>Foto:</td>
                        <td><input type="file" name="foto[]" value="" size="26" /></td>
                    </tr>
                    <tr><td align="center">
                            <input type="submit" value="Enviar Datos" name="submit" />
                        </td>
                        <td align="center">
                            <input type="reset" value="Borrar datos" name="reset" />
                        </td>
                    </tr>
                </table>
            </form>
        </div>
        <div id="errlist" align="center" style="color:red">

        </div>
    </body>
</html>
